﻿<Window x:Class="ttg_internal.Utilities.UsageVisualizer.View.MainView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:convert="clr-namespace:ttg_internal.Utilities.UsageVisualizer.Converter"
    xmlns:custControls="clr-namespace:ttg_internal.Utilities.UsageVisualizer.Other.Controls"
    xmlns:view="clr-namespace:ttg_internal.Utilities.UsageVisualizer.View"
    xmlns:viewModel="clr-namespace:ttg_internal.Utilities.UsageVisualizer.ViewModel"
    Height="480" Width="640" Title="Device Usage">
    
    <Window.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/Utilities.Common;component/Styles/DefaultStyles.xaml" />
                <ResourceDictionary Source="/Utilities.Common;component/Styles/CustomStyles.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Window.Resources>
    
    <Grid>
        <Grid.Resources>
            <!-- Data Templates -->

            <!-- Tab item with a large image -->
            <DataTemplate x:Key="ImageTabItemTemplate">
                <DataTemplate.Resources>
                    <!-- Title style -->
                    <Style x:Key="TitleBlockStyle" TargetType="{x:Type TextBlock}" BasedOn="{StaticResource {x:Type TextBlock}}">
                        <Setter Property="FontSize" Value="36" />
                        <Setter Property="VerticalAlignment" Value="Center" />
                    </Style>

                    <!-- Tab header templates -->
                    <DataTemplate DataType="{x:Type viewModel:GlobalUsageTabViewModel}">
                        <TextBlock Style="{StaticResource TitleBlockStyle}" Text="{Binding Title}" />
                    </DataTemplate>
                    <DataTemplate DataType="{x:Type viewModel:DeviceUsageTabViewModel}">
                        <StackPanel Orientation="Horizontal">
                            <StackPanel.Resources>
                                <convert:DeviceIconConverter x:Key="DeviceIconConverter" />
                            </StackPanel.Resources>

                            <custControls:BarGraph Percentage="{Binding DeviceInfo.Usage}" VerticalAlignment="Center" />
                            <!--<TextBlock Style="{StaticResource TitleBlockStyle}" Text="{Binding Title}" />-->
                            <Image Source="{Binding DeviceInfo.Name, Converter={StaticResource DeviceIconConverter}}" Height="64" />
                        </StackPanel>
                    </DataTemplate>
                </DataTemplate.Resources>

                <ContentPresenter Content="{Binding}" Height="100" />
            </DataTemplate>

            <!-- Applies an GlobalUsageTabView to an instance of the GlobalUsageTabViewModel class shown in the main window -->
            <DataTemplate DataType="{x:Type viewModel:GlobalUsageTabViewModel}">
                <view:GlobalUsageTabView />
            </DataTemplate>

            <!-- Applies an DeviceUsageTabView to an instance of the DeviceUsageTabViewModel class shown in the main window -->
            <DataTemplate DataType="{x:Type viewModel:DeviceUsageTabViewModel}">
                <view:DeviceUsageTabView />
            </DataTemplate>

            <!-- Styles -->

            <!-- TabControl with images in the header -->
            <Style x:Key="VerticalTabControlStyle" TargetType="{x:Type TabControl}" BasedOn="{StaticResource {x:Type TabControl}}">
                <Setter Property="ItemTemplate" Value="{StaticResource ImageTabItemTemplate}" />
                <Setter Property="TabStripPlacement" Value="Left" />
            </Style>
            
            <CollectionViewSource x:Key="GlobalUsageTabs" Source="{Binding GlobalUsageTabs}" />
            <CollectionViewSource x:Key="DeviceUsageTabs" Source="{Binding DeviceUsageTabs}" />
        </Grid.Resources>

        <TabControl Style="{StaticResource VerticalTabControlStyle}" IsSynchronizedWithCurrentItem="True">
            <TabControl.ItemsSource>
                <CompositeCollection>
                    <CollectionContainer Collection="{Binding Source={StaticResource GlobalUsageTabs}}" />
                    <CollectionContainer Collection="{Binding Source={StaticResource DeviceUsageTabs}}" />
                </CompositeCollection>
            </TabControl.ItemsSource>
        </TabControl>
    </Grid>
</Window>